<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<jsp:include page="../inc.jsp"></jsp:include>
<script type="text/javascript" charset="utf-8">
	var datagrid;
	$(function() {	
		$('form input').bind('keyup', function(event) {/* 增加回车提交功能 */
			if (event.keyCode == '13') {
				datagrid.datagrid('load', sy.serializeObject($('#searchForm')));
			}
		});	
		datagrid = $('#datagrid').datagrid({
			url : 'memberAction!datagridTotal.html',
			title : '会员统计列表',
			iconCls : 'icon-save',
			pagination : true,
			pagePosition : 'bottom',
			pageSize : 10,
			pageList : [ 10, 20, 30, 40 ],
			fit : true,
			fitColumns : false,
			nowrap : false,
			border : false,
			idField : 'id',
			sortName : 'consume',
			sortOrder : 'desc',
			checkOnSelect : false,
			selectOnCheck : true,
			/* frozenColumns : [ [ {
				title : '会员编号',
				field : 'serial',
				width : 150,
				sortable : true
			} ] ],
			columns : [ [  {
				title : '会员姓名',
				field : 'name',
				width : 100,
				align:'center'
			}, {
				title : '会员类型',
				field : 'tname',
				width : 100,
				align:'center'
			},{
				title : '手机',
				field : 'mobile',
				width : 100,
				align:'center'
			},{
				title : '开卡时间',
				field : 'openDate',
				width : 140,
				align:'center'
			},{
				title : '生日',
				field : 'birthdayB',
				width : 100,
				align:'center',
				formatter : function(value, row, index) {
					return value.substring(0,10);
				}
			},{
				title : '消费金额',
				field : 'consume',
				width : 100,
				align:'center'
			},{
				title : '积分',
				field : 'point',
				width : 100,
				align:'center'
			}] ],	 */		
			onRowContextMenu : function(e, rowIndex, rowData) {
				e.preventDefault();
				$(this).datagrid('unselectAll');
				$(this).datagrid('selectRow', rowIndex);
				$('#menu').menu('show', {
					left : e.pageX,
					top : e.pageY
				});
			}
		});
		
		fetchData("repertory");
		$('#datagrid').datagrid('reload');
		
		var rid = $('#searchForm').find('input[name=rid]');
		var ridCombobox = rid.combobox({
			url : '${pageContext.request.contextPath}/rkgl/repertoryAction!noAuth_combobox.html',
			valueField : 'id',
			textField : 'name',
			multiple : false,
			editable : false,
			panelHeight : 'auto'
		});

	});

	//拼装datagrid
	function fetchData(groupby) { 
		var ss = "[[{title : '仓库',field : 'rname',width : 150,align:'center'},";
		if(groupby=="sex"){
			ss = "[[{title : '性别',field : 'sex',width : 150,align:'center'},";
		}else if(groupby=="type"){
			ss = "[[{title : '会员类型',field : 'mtname',width : 150,align:'center'},";
		}
	    var s = ss+
	    	"{title : '消费金额',field : 'consume',width : 150,align:'center'},"+
	    	"{title : '会员数量',field : 'num',width : 150,align:'center'},"+
	    	"{title : '会员积分',field : 'point',width : 150,align:'center'}]]"
	    options={}; 
	    options.columns = eval(s);
	  	$('#datagrid').datagrid(options);
	} 
	
	function _search() {
		var groupby = $('#searchForm input[name="groupby"]:checked').val();
		fetchData(groupby);
		datagrid.datagrid('load', sy.serializeObject($('#searchForm')));
		$("#totalimgconsume").attr("src","${pageContext.request.contextPath}/hygl/memberAction!memberTotalChart.html?order=consume&groupby="+groupby+"&random="+Math.random());
		$("#totalimgcount").attr("src","${pageContext.request.contextPath}/hygl/memberAction!memberTotalChart.html?order=count&groupby="+groupby+"&random="+Math.random());
		$("#totalimgpoint").attr("src","${pageContext.request.contextPath}/hygl/memberAction!memberTotalChart.html?order=point&groupby="+groupby+"&random="+Math.random());
	}
	function cleanSearch() {
		datagrid.datagrid('load', {});
		$('#searchForm input').val('');
	}
</script>
</head>
<body class="easyui-layout" data-options="fit:true">
	<div data-options="region:'north',border:false,title:'搜索条件'" style="height: 55px;overflow: hidden;" align="left">
		<form id="searchForm">
			<table class="tableForm datagrid-toolbar" style="width: 100%;height: 100%;">
			    <tr>
			        <!--  th style="width:60px;">所属仓库</th>
					<td style="width:16px;"><input name="rid" style="width: 110px;" /></td-->
					<th style="width:60px;">消费金额</th>
					<td style="width:220px;">&nbsp;&nbsp;<input name="consumeStart" style="width: 80px;" />&nbsp;&nbsp;至&nbsp;&nbsp;<input name="consumeEnd" style="width: 80px;" /></td>
					<th style="width:60px;">积分</th>
					<td style="width:220px;">&nbsp;&nbsp;<input name="pointStart" style="width: 80px;" />&nbsp;&nbsp;至&nbsp;&nbsp;<input name="pointEnd" style="width: 80px;" /></td>
					<td>统计方式
					<input type="radio" name="groupby" value="repertory"  checked="checked" style="width: 10px;"/>按仓库 
<!-- 					<input type="radio" name="groupby" value="sex" style="width: 10px;"/>按性别
 -->					<input type="radio" name="groupby" value="type" style="width: 10px;"/>会员类型
					</td>
					<td><a href="javascript:void(0);" class="easyui-linkbutton" onclick="_search();">查询</a><a href="javascript:void(0);" class="easyui-linkbutton" onclick="cleanSearch();">清空</a></td>					
				</tr>
			</table>
		</form>
	</div>
	<div data-options="region:'center',border:false" style="overflow: hidden;">
		<table id="datagrid"></table>
	</div>
	<div data-options="region:'south',border:false" style="height: 240px;overflow: hidden;">
		<img id="totalimgconsume" align="left" src="${pageContext.request.contextPath}/hygl/memberAction!memberTotalChart.html?order=consume"/>
		<img id="totalimgcount" align="center" src="${pageContext.request.contextPath}/hygl/memberAction!memberTotalChart.html?order=count"/>
		<img id="totalimgpoint" align="right" src="${pageContext.request.contextPath}/hygl/memberAction!memberTotalChart.html?order=point"/>
	</div>
</body>
</html>